<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>OPPO登录页面</title>
<link rel="stylesheet" type="text/css" href="static/css/main.css" />
<script type="text/javascript" src="static/js/jquery-1.12.4.js"></script>
</head>
<body>
	<div class="container">
		<div class="guidecolumn">
			<ul>
				<li class=""><a href="index.jsp">OPPO官网</a></li>
				<li class=""><a href="#">OPPO社区</a></li>
				<li class=""><a href="#">ColorOS</a></li>
			</ul>
		</div>
		<form id = "longininfo" action = "index.jsp">
			<div class="main">
				<div class="logo">
					<img src="static/img/oppo_logo.png" height="60px" width="250px"
						style="margin-left: 460px;">
					<p style="height: 20px; margin-left: 455px; font-size: medium;">登录OPPO帐号可享受更多的服务</P>
				</div>

				<div class="login" style = "margin-left: 580px;">
					<!--手机号-->
					<div class="row1">
						<input id = "phoneNum" class="row1_1" name="user_id" type="text"
							placeholder="请输入手机号码">
					</div>
					<!-- 验证账号不能为空 -->
					<div id = "phoneNumtip" style="margin-left: 40px;font-size: x-small;color: red;display: none;"> 请输入账号  </div>
					<!--密码-->
					
					<div class="row1">
						<input id ="passPsw"  class="row1_1" name ="user_psw" type="password"
							placeholder="请输入密码">
					</div>
					
					<!--验证密码不能为空--->
						<div id = "passPswtip" style="margin-left: 40px;font-size: x-small;color: red;display: none;"> 请输入密码</div>
					<!--忘记密码-->
					<div style="margin-bottom: 20px; margin-top: -4px;">
						<a style="margin-left: 280px;  color: #2AAD6F;"
							href="#">忘记密码</a>
					</div>
					<!--登陆-->
					<div class="row1">
						<input class="row1_2" type="submit" value=" 登录" />
					</div>
					<!--注册-->
					<div class="row1">
						 <input class="row1_3" type="button" value="注册OPPO账号"  onclick="window.location.href='Register.html'"/>
					</div>
				</div>
				<div class="last">© 2005 - 2018 OPPO 版权所有 粤ICP备14056724号-2
					联系方式：4001-666-888</div>
			</div>
		</form>
	</div>
	<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
    <script src="static/layui/layui.js"></script>
    <script src="static/layui/layui.all.js"></script>
	<script type="text/javascript">
			function nouser() {
		        layer.msg('用户尚未注册，请前往注册页面！', {
		  		  offset: '80px',
				  anim: 2
				});
		    }
			function errorpsw() {
		        layer.msg('密码错误！', {
		  		  offset: '80px',
				  anim: 2
				});
		    }
			$(".row1_2").click(function(){
				if($("#phoneNum").val()==""){
				 	$("#phoneNumtip").css("display","block");
				 	return false;
				}else{
					if($("#passPsw").val()==""){
						$("#passPswtip").css("display","block");
					 	return false;
					}else{
						var users = $("#phoneNum").val();
						var info;
						  $.ajax({
							  	url: "LoginWithPswControl",
				                type: "POST",
				                async:false,//默认异步执行  false为同步执行
				                data: $("#longininfo").serialize(),
				                success:function(data){
				                	info = data;
				                	if(data == "errorpsw"){
				                		errorpsw();
				                		
				                	}else if(data == "nulluser"){
				                		nouser();
				                	}
				                }	
						  })
						  if(info == "success"){
							  return true;
						  }
						  return false;
						  
					}

				} 
			});
			$("#phoneNum").focus(function(){
			   	$("#phoneNumtip").css("display","none");
		    });
		    $("#passPsw").focus(function(){
			   	 $("#passPswtip").css("display","none");
		    });
		    
		</script>
</body>
</html>
